// The "Main" Script
-->
// function removeEmptyRowsFromPopupContent(content, feature) {
// var tempDiv = document.createElement('div');
// tempDiv.innerHTML = content;
// var rows = tempDiv.querySelectorAll('tr');
// for (var i = 0; i < rows.length; i++) {
// var td = rows[i].querySelector('td.visible-with-data');
// var key = td ? td.id : '';
// if (td && td.classList.contains('visible-with-data') && feature.properties[key] == null) {
// rows[i].parentNode.removeChild(rows[i]);
// }
// }
// return tempDiv.innerHTML;
// }
//
//
// function addClassToPopupIfMedia(content, popup) {
// var tempDiv = document.createElement('div');
// tempDiv.innerHTML = content;
// if (tempDiv.querySelector('td img')) {
// popup._contentNode.classList.add('media');
// // Delay to force the redraw
// setTimeout(function() {
// popup.update();
// }, 10);
// } else {
// popup._contentNode.classList.remove('media');
// }
// }
// warning these two function may not actually be called and putting them in separate js fileSize
// may work only because they are not called.
var zoomControl = L.control.zoom({position: 'topleft'}).addTo(map);
var bounds_group = new L.featureGroup([]);
function setBounds() {}
// OpenStreetMap
if (true) {
map.createPane('pane_OpenStreetMap_0');
map.getPane('pane_OpenStreetMap_0').style.zIndex = 400;
var layer_OpenStreetMap_0 = L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
pane: 'pane_OpenStreetMap_0',
opacity: 1.0,
attribution: '',
minZoom: 1,
maxZoom: 20,
minNativeZoom: 0,
maxNativeZoom: 19
});
layer_OpenStreetMap_0;
map.addLayer(layer_OpenStreetMap_0);
}
// GoogleSatellite
if (true) {
map.createPane('pane_GoogleSatellite_1');
map.getPane('pane_GoogleSatellite_1').style.zIndex = 401;
var layer_GoogleSatellite_1 = L.tileLayer('https://www.google.cn/maps/vt?lyrs=s@189&gl=cn&x={x}&y={y}&z={z}', {
pane: 'pane_GoogleSatellite_1',
opacity: 1.0,
attribution: '',
minZoom: 1,
maxZoom: 20,
minNativeZoom: 0,
maxNativeZoom: 18
});
layer_GoogleSatellite_1;
map.addLayer(layer_GoogleSatellite_1);
}
// Chiawana2Sacagawea
if (true) {
function pop_Chiawana2Sacagawea_V2_2(feature, layer) {
var Q1 = (feature.properties['Name'] !== null
? Q1 = (feature.properties['Name'].toLocaleString())
: '')
var Q2 = (feature.properties['Desc'] !== null
? Q2 = (feature.properties['Desc'].toLocaleString())
: '')
var Q3 = (feature.properties['PublicLink'] !== null
? Q3 = 'PublicLink'
: '')
var Q4 = (feature.properties['SOSLink'] !== null
? Q4 = 'SOSLink'
: '')
var Q5 = (feature.properties['ExternLink'] !== null
? Q5 = 'ExternLink'
: '')
var Q6 = (feature.properties['PhotoPath'] !== null
? Q6 = ''
: '')
var popupContent = '\
' + Q1 + ' |
\
' + Q2 + ' |
\
' + Q3 + ' |
\
' + Q4 + ' |
\
' + Q5 + ' |
\
' + Q6 + ' |
\
';
var content = removeEmptyRowsFromPopupContent(popupContent, feature);
layer.on('popupopen', function(e) {
addClassToPopupIfMedia(content, e.popup);
});
layer.bindPopup(content, { maxHeight: 400 });
}
function style_Chiawana2Sacagawea_V2_2_0() {
return {
pane: 'pane_Chiawana2Sacagawea_V2_2',
radius: 8.0,
opacity: 1,
color: 'rgba(255,255,255,1.0)',
dashArray: '',
lineCap: 'butt',
lineJoin: 'miter',
weight: 2.0,
fill: true,
fillOpacity: 1,
fillColor: 'rgba(121,252,14,1.0)',
interactive: true,
}
}
map.createPane('pane_Chiawana2Sacagawea_V2_2');
map.getPane('pane_Chiawana2Sacagawea_V2_2').style.zIndex = 402;
map.getPane('pane_Chiawana2Sacagawea_V2_2').style['mix-blend-mode'] = 'normal';
var layer_Chiawana2Sacagawea_V2_2 = new L.geoJson(json_Chiawana2Sacagawea_V2_2, {
attribution: '',
interactive: true,
dataVar: 'json_Chiawana2Sacagawea_V2_2',
layerName: 'layer_Chiawana2Sacagawea_V2_2',
pane: 'pane_Chiawana2Sacagawea_V2_2',
onEachFeature: pop_Chiawana2Sacagawea_V2_2,
pointToLayer: function (feature, latlng) {
var context = {
feature: feature,
variables: {}
};
return L.circleMarker(latlng, style_Chiawana2Sacagawea_V2_2_0(feature));
},
});
bounds_group.addLayer(layer_Chiawana2Sacagawea_V2_2);
map.addLayer(layer_Chiawana2Sacagawea_V2_2);
}
// Selph2Chiawana
if (true) {
function pop_Selph2Chiawana_V2_3(feature, layer) {
var Q1 = (feature.properties['Name'] !== null
? Q1 = (feature.properties['Name'].toLocaleString())
: '')
var Q2 = (feature.properties['Desc'] !== null
? Q2 = (feature.properties['Desc'].toLocaleString())
: '')
var Q3 = (feature.properties['PublicLink'] !== null
? Q3 = 'PublicLink'
: '')
var Q4 = (feature.properties['SOSLink'] !== null
? Q4 = 'SOSLink'
: '')
var Q5 = (feature.properties['ExternLink'] !== null
? Q5 = 'ExternLink'
: '')
var Q6 = (feature.properties['PhotoPath'] !== null
? Q6 = ''
: '')
var popupContent = '\
' + Q1 + ' |
\
' + Q2 + ' |
\
' + Q3 + ' |
\
' + Q4 + ' |
\
' + Q5 + ' |
\
' + Q6 + ' |
\
';
var content = removeEmptyRowsFromPopupContent(popupContent, feature);
layer.on('popupopen', function(e) {
addClassToPopupIfMedia(content, e.popup);
});
layer.bindPopup(content, { maxHeight: 400 });
}
function style_Selph2Chiawana_V2_3_0() {
return {
pane: 'pane_Selph2Chiawana_V2_3',
shape: 'triangle',
radius: 10.0,
opacity: 1,
color: 'rgba(50,87,128,1.0)',
dashArray: '',
lineCap: 'butt',
lineJoin: 'miter',
weight: 2.0,
fill: true,
fillOpacity: 1,
fillColor: 'rgba(255,255,150,1.0)',
interactive: true,
}
}
map.createPane('pane_Selph2Chiawana_V2_3');
map.getPane('pane_Selph2Chiawana_V2_3').style.zIndex = 403;
map.getPane('pane_Selph2Chiawana_V2_3').style['mix-blend-mode'] = 'normal';
var layer_Selph2Chiawana_V2_3 = new L.geoJson(json_Selph2Chiawana_V2_3, {
attribution: '',
interactive: true,
dataVar: 'json_Selph2Chiawana_V2_3',
layerName: 'layer_Selph2Chiawana_V2_3',
pane: 'pane_Selph2Chiawana_V2_3',
onEachFeature: pop_Selph2Chiawana_V2_3,
pointToLayer: function (feature, latlng) {
var context = {
feature: feature,
variables: {}
};
return L.shapeMarker(latlng, style_Selph2Chiawana_V2_3_0(feature));
},
});
bounds_group.addLayer(layer_Selph2Chiawana_V2_3);
map.addLayer(layer_Selph2Chiawana_V2_3);
}
// Ringold2Selph
if (true) {
function pop_Ringold2Selph_V2_4(feature, layer) {
var Q1 = (feature.properties['Name'] !== null
? Q1 = (feature.properties['Name'].toLocaleString())
: '')
var Q2 = (feature.properties['Desc'] !== null
? Q2 = (feature.properties['Desc'].toLocaleString())
: '')
var Q3 = (feature.properties['PublicLink'] !== null
? Q3 = 'PublicLink'
: '')
var Q4 = (feature.properties['SOSLink'] !== null
? Q4 = 'SOSLink'
: '')
var Q5 = (feature.properties['ExternLink'] !== null
? Q5 = 'ExternLink'
: '')
var Q6 = (feature.properties['PhotoPath'] !== null
? Q6 = ''
: '')
var popupContent = '\
' + Q1 + ' |
\
' + Q2 + ' |
\
' + Q3 + ' |
\
' + Q4 + ' |
\
' + Q5 + ' |
\
' + Q6 + ' |
\
';
var content = removeEmptyRowsFromPopupContent(popupContent, feature);
layer.on('popupopen', function(e) {
addClassToPopupIfMedia(content, e.popup);
});
layer.bindPopup(content, { maxHeight: 400 });
}
function style_Ringold2Selph_V2_4_0() {
return {
pane: 'pane_Ringold2Selph_V2_4',
radius: 10.0,
opacity: 1,
color: 'rgba(35,35,35,1.0)',
dashArray: '',
lineCap: 'butt',
lineJoin: 'miter',
weight: 1,
fill: true,
fillOpacity: 1,
fillColor: 'rgba(255,0,0,1.0)',
interactive: true,
}
}
map.createPane('pane_Ringold2Selph_V2_4');
map.getPane('pane_Ringold2Selph_V2_4').style.zIndex = 404;
map.getPane('pane_Ringold2Selph_V2_4').style['mix-blend-mode'] = 'normal';
var layer_Ringold2Selph_V2_4 = new L.geoJson(json_Ringold2Selph_V2_4, {
attribution: '',
interactive: true,
dataVar: 'json_Ringold2Selph_V2_4',
layerName: 'layer_Ringold2Selph_V2_4',
pane: 'pane_Ringold2Selph_V2_4',
onEachFeature: pop_Ringold2Selph_V2_4,
pointToLayer: function (feature, latlng) {
var context = {
feature: feature,
variables: {}
};
return L.circleMarker(latlng, style_Ringold2Selph_V2_4_0(feature));
},
});
bounds_group.addLayer(layer_Ringold2Selph_V2_4);
map.addLayer(layer_Ringold2Selph_V2_4);
}
// TaptealWaterTrail
if (true) {
function pop_TaptealWaterTrail_V2_5(feature, layer) {
var Q1 = (feature.properties['Name'] !== null
? Q1 = (feature.properties['Name'].toLocaleString())
: '')
var Q1a = (feature.properties['RiverMile'] !== null
? Q1a = (feature.properties['RiverMile'].toLocaleString())
: '')
Qx = "River Mile = " + Q1a
var Q2 = (feature.properties['Desc'] !== null
? Q2 = (feature.properties['Desc'].toLocaleString())
: '')
var Q3 = (feature.properties['PublicLink'] !== null
? Q3 = 'PublicLink'
: '')
var Q4 = (feature.properties['SOSLink'] !== null
? Q4 = 'SOSLink'
: '')
var Q5 = (feature.properties['ExternLink'] !== null
? Q5 = 'ExternLink'
: '')
var Q6 = (feature.properties['PhotoPath'] !== null
? Q6 = ''
: '')
var popupContent = '\
' + Q1 + ' |
\
' + Qx + ' |
\
' + Q2 + ' |
\
' + Q3 + ' |
\
' + Q4 + ' |
\
' + Q5 + ' |
\
' + Q6 + ' |
\
';
var content = removeEmptyRowsFromPopupContent(popupContent, feature);
layer.on('popupopen', function(e) {addClassToPopupIfMedia(content, e.popup);});
layer.bindPopup(content, { maxHeight: 400 });
}
function style_TaptealWaterTrail_V2_5_0() {
return {
pane: 'pane_TaptealWaterTrail_V2_5',
radius: 10.0,
opacity: 1,
color: 'rgba(35,35,35,1.0)',
dashArray: '',
lineCap: 'butt',
lineJoin: 'miter',
weight: 1,
fill: true,
fillOpacity: 1,
fillColor: 'rgba(255,0,0,1.0)',
interactive: true,
}
}
map.createPane('pane_TaptealWaterTrail_V2_5');
map.getPane('pane_TaptealWaterTrail_V2_5').style.zIndex = 405;
map.getPane('pane_TaptealWaterTrail_V2_5').style['mix-blend-mode'] = 'normal';
var layer_TaptealWaterTrail_V2_5 = new L.geoJson(json_TaptealWaterTrail_V2_5, {
attribution: '',
interactive: true,
dataVar: 'json_TaptealWaterTrail_V2_5',
layerName: 'layer_TaptealWaterTrail_V2_5',
pane: 'pane_TaptealWaterTrail_V2_5',
onEachFeature: pop_TaptealWaterTrail_V2_5,
pointToLayer: function (feature, latlng) {
var context = {
feature: feature,
variables: {}
};
return L.circleMarker(latlng, style_TaptealWaterTrail_V2_5_0(feature));
},
});
bounds_group.addLayer(layer_TaptealWaterTrail_V2_5);
map.addLayer(layer_TaptealWaterTrail_V2_5);
}
// add data to map and legend??
if (true) {
var baseMaps = {};
// Make data visible on map and add to symbol key
//png symbol files are in the ./legend folder
var overlaysTree = [
{label: ' TaptealWaterTrail_V2', layer: layer_TaptealWaterTrail_V2_5},
{label: ' Ringold2Selph_V2', layer: layer_Ringold2Selph_V2_4},
{label: ' Selph2Chiawana_V2', layer: layer_Selph2Chiawana_V2_3},
{label: ' Chiawana2Sacagawea_V2', layer: layer_Chiawana2Sacagawea_V2_2},
{label: "Google Satellite", layer: layer_GoogleSatellite_1},
{label: "OpenStreetMap", layer: layer_OpenStreetMap_0},
]
// Controls key initial appearance??
var lay = L.control.layers.tree(null, overlaysTree,{
//namedToggle: true,
//selectorBack: false,
//closedSymbol: '⊞ 🗀',
//openedSymbol: '⊟ 🗁',
//collapseAll: 'Collapse all',
//expandAll: 'Expand all',
collapsed: false,
});
// all the heavy lifting done here
lay.addTo(map);
}
// add listener events probably related to mouse position ??
if (true) {
document.addEventListener("DOMContentLoaded", function() {
// set new Layers List height which considers toggle icon
function newLayersListHeight() {
var layerScrollbarElement = document.querySelector('.leaflet-control-layers-scrollbar');
if (layerScrollbarElement) {
var layersListElement = document.querySelector('.leaflet-control-layers-list');
var originalHeight = layersListElement.style.height || window.getComputedStyle(layersListElement).height;
var newHeight = parseFloat(originalHeight) - 50;
layersListElement.style.height = newHeight + 'px';
}
}
var isLayersListExpanded = true;
var controlLayersElement = document.querySelector('.leaflet-control-layers');
var toggleLayerControl = document.querySelector('.leaflet-control-layers-toggle');
// toggle Collapsed/Expanded and apply new Layers List height
toggleLayerControl.addEventListener('click', function() {
if (isLayersListExpanded) {
controlLayersElement.classList.remove('leaflet-control-layers-expanded');
} else {
controlLayersElement.classList.add('leaflet-control-layers-expanded');
}
isLayersListExpanded = !isLayersListExpanded;
newLayersListHeight()
});
// apply new Layers List height if toggle layerstree
if (controlLayersElement) {
controlLayersElement.addEventListener('click', function(event) {
var toggleLayerHeaderPointer = event.target.closest('.leaflet-layerstree-header-pointer span');
if (toggleLayerHeaderPointer) {
newLayersListHeight();
}
});
}
// Collapsed/Expanded at Start to apply new height
setTimeout(function() {
toggleLayerControl.click();
}, 10);
setTimeout(function() {
toggleLayerControl.click();
}, 10);
// Collapsed touch/small screen
var isSmallScreen = window.innerWidth < 650;
if (isSmallScreen) {
setTimeout(function() {
controlLayersElement.classList.remove('leaflet-control-layers-expanded');
isLayersListExpanded = !isLayersListExpanded;
}, 500);
}
});
setBounds();
}
// Bind Tool Tip to cause popup of 'Name' for each layer
if (true) {
var i = 0;
layer_Chiawana2Sacagawea_V2_2.eachLayer(function(layer) {
var context = {
feature: layer.feature,
variables: {}
};
layer.bindTooltip((layer.feature.properties['Name'] !== null
? String(''
+ layer.feature.properties['Name']) + '
'
:''),
{permanent: true, offset: [-0, -16], className: 'css_Chiawana2Sacagawea_V2_2'});
labels.push(layer);
totalMarkers += 1;
layer.added = true;
addLabel(layer, i);
i++;
});
var i = 0;
layer_Selph2Chiawana_V2_3.eachLayer(function(layer) {
var context = {feature: layer.feature, variables: {}};
layer.bindTooltip((layer.feature.properties['Name'] !== null
? String('' +
layer.feature.properties['Name']) + '
'
:''),
{permanent: true, offset: [-0, -16], className: 'css_Selph2Chiawana_V2_3'});
labels.push(layer);
totalMarkers += 1;
layer.added = true;
addLabel(layer, i);
i++;
});
var i = 0;
layer_Ringold2Selph_V2_4.eachLayer(function(layer) {
var context = {
feature: layer.feature,
variables: {}
};
layer.bindTooltip((layer.feature.properties['Name'] !== null?String('' + layer.feature.properties['Name']) + '
':''), {permanent: true, offset: [-0, -16], className: 'css_Ringold2Selph_V2_4'});
labels.push(layer);
totalMarkers += 1;
layer.added = true;
addLabel(layer, i);
i++;
});
var i = 0;
layer_TaptealWaterTrail_V2_5.eachLayer(function(layer) {
var context = {
feature: layer.feature,
variables: {}
};
layer.bindTooltip((layer.feature.properties['Name'] !== null?String('' + layer.feature.properties['Name']) + '
':''), {permanent: true, offset: [-0, -16], className: 'css_TaptealWaterTrail_V2_5'});
labels.push(layer);
totalMarkers += 1;
layer.added = true;
addLabel(layer, i);
i++;
});
}
resetLabels([layer_Chiawana2Sacagawea_V2_2,layer_Selph2Chiawana_V2_3,layer_Ringold2Selph_V2_4,layer_TaptealWaterTrail_V2_5]);
map.on("zoomend", function()
{resetLabels([layer_Chiawana2Sacagawea_V2_2,layer_Selph2Chiawana_V2_3,layer_Ringold2Selph_V2_4,layer_TaptealWaterTrail_V2_5]); });
map.on("layeradd", function()
{resetLabels([layer_Chiawana2Sacagawea_V2_2,layer_Selph2Chiawana_V2_3,layer_Ringold2Selph_V2_4,layer_TaptealWaterTrail_V2_5]); });
map.on("layerremove", function()
{resetLabels([layer_Chiawana2Sacagawea_V2_2,layer_Selph2Chiawana_V2_3,layer_Ringold2Selph_V2_4,layer_TaptealWaterTrail_V2_5]); });